#{extends 'main.html' /}
<link rel="stylesheet" href="/public/stylesheets/plugins/ztree/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="/public/javascripts/jquery.ztree.all.min.js"></script>
<div class="row wrapper border-bottom white-bg page-heading">
        <!-- <div class="wrapper wrapper-content animated fadeInRight"> -->
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title">
                            <h5>角色编辑</h5>
                        </div>
                        <div class="ibox-content">
                        #{form @security.Roles.update(role?.id),method:'PUT',id:'editForm',class:'form-horizontal'}
                            <div class="form-group form-inline">
                                #{f.text_field 'role.name',label:'角色名称',required:'true',value:role?.name,maxlength:16 /}
                            </div>
                          <input type="hidden" name="sele_pids" value="${params['sele_pids']?params['sele_pids']:ids}" id="sele_pids"/> 
                           <div id="permission_tree">
                                     <ul id="authTree" class="ztree"></ul>
                            </div>
                             <input type="hidden" name="pcodes" value="${array}" id="pcodes"/>     
                                <div class="form-group">
                                    <div class="col-sm-4 form-btn-area">
                                       #{f.button '保存',href:'javascript:submitForm();',class:"btn btn-primary" /}
                                       #{f.button '取消',href:@security.Roles.index(),class:"btn btn-white"/}
                                    </div>
                                </div>
                           #{/form}
                        </div>
                    </div>
                </div>
            </div>
        </div>
       <script type="text/javascript">
       
       <!--
       var setting = {
           check: {
               enable: true
           },
           data: {
               simpleData: {
                   enable: true
               }
           }
       };

       $(document).ready(function(){
           var _nodesStr= $('#pcodes').val();
           var zNodes=JSON.parse(_nodesStr);
           $.fn.zTree.init($("#authTree"), setting, zNodes);
           updateTree();
       });
       //-->
    
       function getTree(){
           return $.fn.zTree.getZTreeObj("authTree");
       }
       
       function updateTree(){
           var ids = $('#sele_pids').val();
           var arr = ids.split(",");
           var zTree = getTree();
           var node;
           for(var i=0;i<arr.length;i++){
               node = zTree.getNodeByParam("id",arr[i],null);
               if(!node.isParent){
                   zTree.checkNode(node,true,true);
               }
           }
       }
       
       function submitForm(){
           var seleObj=$("#sele_pids");
           var zTree = getTree();
           var checkedArr = zTree.getCheckedNodes(true);
           var idArr=[];
           for(var i=0;i<checkedArr.length;i++){
               idArr.push(checkedArr[i].id);
           }
           var idStr = idArr.join(",");
           if(!idStr){
               tipAlert({"title":"请为角色分配权限","type":"warning"})
               return;
           }else{
               seleObj.val(idStr);
               $('#editForm').submit();
           }
       }
       
       </script> 